<template>
  <div>
    <div class="inspection_evaluation">
      <div class="panel_header">
        <i class="iconfont">&#xe66d;</i>
        工厂考察评估主信息
      </div>
      <div class="inspection_evaluation_list">
        <el-form :model="form">
          <el-row class="el_row_bottom">
            <el-col :span="4" class="col_label">采购组织</el-col>
            <el-col :span="4" class="col_view">{{form.purOrgName}}</el-col>
            <el-col :span="4" class="col_label">采购组</el-col>
            <el-col :span="4" class="col_view">{{form.purGroupName}}</el-col>
            <el-col :span="4" class="col_label">单据号</el-col>
            <el-col :span="4" class="col_view">{{form.inspectNo}}</el-col>
          </el-row>
          <el-row class="el_row_bottom">
            <el-col :span="4" class="col_label">标题</el-col>
            <el-col :span="4" class="col_view">{{form.title}}</el-col>
            <el-col :span="4" class="col_label">品类</el-col>
            <el-col :span="4" class="col_view">{{form.categoryCode}}</el-col>
            <el-col :span="4" class="col_label">评估类型</el-col>
            <el-col :span="4" class="col_view">{{form.inspectType == 1 ? '初审' : '年度复审'}}</el-col>
          </el-row>
          <el-row class="el_row_bottom">
            <el-col :span="4" class="col_label">发布状态</el-col>
            <el-col :span="4" class="col_view">{{form.publishStatus == 1 ? '已发布' : '待发布'}}</el-col>
            <el-col :span="4" class="col_label"> 申请人</el-col>
            <el-col :span="4" class="col_view">{{form.publishUserName}}</el-col>
            <el-col :span="4" class="col_label">审核状态</el-col>
            <el-col :span="4" class="col_view">{{form.checkStatus == 1 ? '已审核' : '待审核'}}</el-col>
          </el-row>
          <div v-if="isShow">
            <el-row class="el_row_bottom">
              <el-col :span="4" class="col_label"> 审核人</el-col>
              <el-col :span="4" class="col_view">{{form.checkUserName}}</el-col>
              <el-col :span="4" class="col_label">审核日期</el-col>
              <el-col :span="4" class="col_view">{{form.checkTime}}</el-col>
              <el-col :span="4" class="col_label">完成状态</el-col>
              <el-col :span="4" class="col_view">{{form.completeStatus == 1 ? '已完成' : '未完成'}}</el-col>
            </el-row>
            <el-row class="el_row_bottom">
              <!-- <el-col :span="4" class="col_label">评估岗位</el-col>
              <el-col :span="4" class="col_view">{{form.sysStationName}}</el-col> -->
              <el-col :span="4" class="col_label">附件</el-col>
              <el-col :span="20" class="col_view">
                <a href="javascript:;" @click="download(form.checkFileUrl,form.checkFileName)" class="download_color">{{form.checkFileName}}</a>
              </el-col>
            </el-row>
            <el-row class="el_row_bottom">
              <el-col :span="4" class="col_label">
                <div class="improveRequirement improveRequirement_left">审核意见</div>
              </el-col>
              <el-col :span="20" class="col_view">
                <div class="improveRequirement">{{form.checkOpinion}}</div>
              </el-col>
            </el-row>
          </div>
        </el-form>
      </div>
      <h3 class="panel-title">
        <i class="iconfont">&#xe60b;</i>
        待考察的供应商
      </h3>
      <table-ext :columns="columns" :config="config" ref="tableExter">
      </table-ext>
      <div class="panel_end clearfix">
        <el-button v-if="release" class="fr" type="success" icon="el-icon-success" @click="publish">提交</el-button>
        <el-button v-if="examine" class="fr" type="success" icon="el-icon-success" @click="dialogFormVisible = true">审核</el-button>
      </div>
    </div>
    <div>
      <el-dialog title="审核" :visible.sync="dialogFormVisible">
        <el-form :model="ruleForm" label-width="100px">
          <el-form-item label="结论">
            <el-radio-group v-model="ruleForm.checkStatus">
              <el-radio label="1">通过</el-radio>
              <el-radio label="-1">驳回</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="审核意见">
            <el-input type="textarea" v-model="ruleForm.checkOpinion" maxlength='200'></el-input>
          </el-form-item>
          <el-form-item label="附件上传：">
            <el-upload class="upload-file" ref="upload" :action="this.lib.config.host.system + '/common/fileupload/upload'" :data=fileData
              :limit="1" :on-success="uploadSuccess" :file-list="fileList">
              <el-button slot="trigger" type="primary">选取文件</el-button>
            </el-upload>
          </el-form-item>
          <el-form-item>
            <div class="dialog-footer clearfix">
              <el-button class="fr" type="primary" @click="examiner(ruleForm)">提交</el-button>
              <el-button class="fr dialog-footer-false" @click="dialogFormVisible = false">取 消</el-button>
            </div>
          </el-form-item>
        </el-form>
      </el-dialog>
    </div>
  </div>
</template>
<script>
  import TableExt from '@/components/common/table-ext/table-ext.vue';
  import TableIcon from '@/components/common/table-ext/table-icon';
  import Experts from '@/components/common/select-ext/experts.vue';
  import qs from 'qs';
  export default {
    // 引入自定义表格组件
    components: {
      Experts,
      'table-ext': TableExt
    },
    data() {
      return {
        fileList: [],
        // 定义附件的业务模块和业务动作
        fileData: {
          busAction: "INSPEC_CHECK",
          tableName: "INSPEC",
          tableId: this.$route.query.id
        },
        isShow: false,
        examine: false,
        release: false,
        formLabelWidth: '200px',
        tableData2: [],
        ruleForm: {
          checkStatus: '',
          checkOpinion: '',
          checkFileId: ''
        },
        form: {
          purOrgId: '',
          purGroupId: '',
          inspectNo: '',
          title: '',
          sysStationName: '',
          categoryCode: '',
          inspectType: '',
          checkOpinion: '',
          publishStatus: '',
          checkStatus: ''
        },
        form2: {
          pageSize: 15,
          pageNo: 1
        },
        total2: 0,
        materialId: this.$route.query.id,
        // 弹框显示控制
        dialogFormVisible: false,
        // 新增|修改弹框控制
        dialogUpdate: false,
        config: { // 页面共通配置
          title: '工厂对应的物料信息', //页面标题
          isPage: true, //是否分页
          isNo: true, //是否显示序号
          selection: true, //是否显示复选框
          crudMapping: { // CRUD方法
            query: {
              url: this.lib.config.host.vendorDlv + "/vendormgt/dlv/factoryInspect/getItemList/" + this.$route.query.id,
              method: 'securityPost'
            }
          }
        },
        // 表格列定义
        columns: [{
            width: '120',
            label: '操作', // 表格header
            render: (createElement, params) => { // 动态渲染，click事件示例
              let _this = this;
              if (params.row.completeStatus == this.lib.common.status.YES) {
                return createElement('div', {}, [createElement('el-button', {
                  props: {
                    type: 'text',
                  },
                  on: {
                    click() {
                      _this.setCurrent(params.row.id)
                    }
                  }
                }, '查看评分')])
              } else {
                return createElement('div', {}, [createElement('el-button', {
                  props: {
                    type: 'text',
                  }
                }, '--')])
              }
            }
          }, {
            label: '供应商编码',
            key: 'vendorCode',
            width: '120',
          }, {
            label: 'ERP编码',
            key: 'vendorErpCode',
            width: '120',
          },
          {
            label: '供应商名称',
            key: 'vendorName',
            width: '240',
          },
          {
            label: '评估维度',
            key: 'assessDictItemName',
            width: '120',
          },
          {
            label: '评估岗位',
            key: 'sysStationName',
            width: '240',
          },
          {
            label: '评估方式',
            key: 'resultType',
            width: '120',
            render: (createElement, params) => { //动态渲染, 字典表示例
              let resultType = params.row.resultType;
              if (resultType == 1) {
                return createElement('div', '模板');
              } else {
                return createElement('div', '附件');
              }
            }
          },
          {
            label: '预计完成时间',
            key: 'planTime',
            width: '120',
          },
          {
            label: '评分模板',
            key: 'tempName'
          },
          {
            label: '评估结果',
            key: 'resultFlag',
            render: (createElement, params) => { //动态渲染, 字典表示例
              let inspectType = params.row.resultFlag;
              if (inspectType == 1) {
                return createElement('div', '合格');
              } else if (inspectType == -1) {
                return createElement('div', '不合格');
              } else {
                return createElement('div', '');
              }
            }
          },
          {
            label: '是否需要整改',
            key: 'improveFlag',
            width: '120',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.improveFlag,
                  titles: [{
                    status: 0,
                    title: '否'
                  }, {
                    status: 1,
                    title: '是'
                  }]
                }
              });
            }
          }, {
            label: '反馈状态',
            key: 'feedbackStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.feedbackStatus,
                  titles: [{
                    status: 0,
                    title: '未反馈'
                  }, {
                    status: 1,
                    title: '已反馈'
                  }]
                }
              });
            }
          }, {
            label: '验证状态',
            key: 'checkStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.checkStatus,
                  titles: [{
                    status: 0,
                    title: '未验证'
                  }, {
                    status: 1,
                    title: '已验证'
                  }]
                }
              });
            }
          }, {
            label: '完成状态',
            key: 'completeStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.completeStatus,
                  titles: [{
                    status: 0,
                    title: '未完成'
                  }, {
                    status: 1,
                    title: '已完成'
                  }]
                }
              });
            }
          }, {
            label: '备注',
            key: 'remarks'
          }
        ]
      };
    },
    created() {
      this.getVendorByMatId()
    },
    methods: {
      // 下载附件
      download(filePath, fileName) {
        this.downloadFile(filePath, fileName);
      },
      getVendorByMatId() {
        this.axios.post(this.lib.config.host.vendorDlv + "/vendormgt/dlv/factoryInspect/toViewItem/" + this.$route.query
            .id)
          .then((response) => {
            debugger;
            //from
            console.log(999955)
            console.log(response.data)
            this.form = response.data;
            if (!response.data.publishStatus) {
              this.release = true;
              this.examine = false;
            } else if (response.data.publishStatus == 1 && response.data.checkStatus == 3) {
              this.release = false;
              this.examine = true;
            } else {
              this.isShow = true;
              this.examine = false;
              this.release = false;
            }
          })
          .catch((error) => {
            console.log(error);
          });
      },
      pageSize2(arg) {
        this.form2.pageSize = arg;
        this.query(this.form2);
      },
      pageNo2(arg) {
        this.form2.pageNo = arg;
        this.query(this.form2);
      },
      //点击查看评分跳转到新页面
      setCurrent(id) {
        window.open('/LookScore?id=' + id)
      },
      publish() {
        this.axios.post(this.lib.config.host.vendorDlv + '/vendormgt/dlv/factoryInspect/factoryInspectMgt/' + this.$route
            .query.id)
          .then((response) => {
            this.$router.push('/Index/VendorDlv/VendorInspect');
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      //审核
      examiner(ruleForm) {
        this.axios.post(this.lib.config.host.vendorDlv + '/vendormgt/dlv/factoryInspect/check/' + this.$route.query.id,
          ruleForm)
        this.$confirm('是否执行此操作?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          })
          .then((response) => {
            this.dialogFormVisible = false;
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.$router.push('/Index/VendorDlv/VendorInspect');
          })
          .catch(function (error) {
            this.$message({
              type: 'info',
              message: '已取消此操作'
            });
            console.log(error);
          });
      },
      handleExceed(files, fileList) {
        console.log(files);
        console.log(fileList);
      },
      // 自动上传附件后返回附件url和name
      uploadSuccess: function (response) {
        //附件上传成功回调
        console.log(8989)
        console.log(response)
        this.ruleForm.checkFileId = response.id;
      }
    }
  }

</script>
